import React, { memo, useEffect } from 'react';

const MemoView = (props) => {
  console.log(props)
  useEffect(() => {
    console.log("执行useEffect")
  })
  return (
    <div>
      <h3>age: {props.user.age}</h3>
      <h3>count: {props.count}</h3>
    </div>
  );
}

// 用于memo()的参数2，一个比较props变化的函数
const areEqual = (prevProps, nextProps) => {
  console.log(prevProps, nextProps)
  // 在新的 props 与旧的 props 具有相同的输出时返回 true；否则应该返回 false。


  //   if (prevProps.user.age === nextProps.user.age) {
  //     console.log('props没有变化')
  //     return true  // 不渲染更新的count, 因为age没有变化
  //   } else {
  //     console.log("props改变")
  //     return false;
  //   }

  // 要判断所有的props:
  if (prevProps.user.age !== nextProps.user.age || prevProps.count !== nextProps.count) {
    return false;
  } else {
    return true;
  }

}

export default memo(MemoView, areEqual)


// export const a = memo(() => { return (<div></div>) }, fn)